<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="icon" th:href="@{/resources/imgs/icon.svg}" />
	<meta name="description" content="Java websocket middleware service">
	<meta name="author" content="xchb">
	<script th:src="@{/resources/js/jquery.js}"></script>
	<script th:src="@{/resources/js/bootstrap.min.js}"></script>
	<link th:href="@{/resources/css/bootstrap.min.css}" rel="stylesheet">
	<link th:href="@{/resources/css/main.css}" rel="stylesheet">
	<title>服务信息</title>

	<style>
		.redColor{
			background-color: red;
			cursor: pointer;
		}
		.greenColor{
			background-color: greenyellow;
			cursor: pointer;
		}
		td{
			cursor: pointer;
		}
	</style>

</head>
<body>


<div class="wrapper-page" style="margin-top: 3%;text-align: center;">

	<h3>
		<span>
			服务总数量 <span th:class="'label label-default '+${datas.serverCount>0?'greenColor':'redColor'}" th:text="${datas.serverCount}"></span>
		</span>
	</h3><br/><br/>
	<div style="width: 90%;display: inline-block;">
		<table class="table table-striped table-hover">
			<thead>
				<tr class="danger">
					<td>
						序号
					</td>
					<td class="active">
						协议
					</td>
					<td>
						节点ip
					</td>
					<td>
						连接数量
					</td>
				</tr>
			</thead>
			<tbody>
				<tr th:if="${datas.items==null || datas.items.size()<1}">
					<td colspan="9" style="color: red;">
						暂无任何服务
					</td>
				</tr>
				<tr th:if="${datas.items!=null || datas.items.size()>0}" th:each="item,state:${datas.items}">
					<td th:text="${state.index+1}"></td>
					<td th:text="${item.protocol}"></td>
					<td th:text="${item.netAddress}"></td>
					<td th:text="${item.connectorCount}"></td>
				</tr>
			</tbody>
		</table>
	</div>



</div>

</body>

<script>



</script>
</html>